<template>
  <rx-layout>
    <template v-slot:center>
      <div class="BpmTaskTransferEdit">
        <div style="color: #4d9eff;display:inline-block;padding-bottom: 16px;">{{form.subject}}</div>
        <div style="margin-bottom: 0.5rem">
          <div style="margin-bottom: 0.25rem">{{i18n('transferringPerson','转办人')}}</div>
          <RxVueUserDialog v-model="form.toUser" :single="true"></RxVueUserDialog>
        </div>
        <div>
          <div>{{i18n('opinion','意见')}}</div>
          <textarea class="BpmTaskTransferEdit-textarea" v-model="form.opinion" :placeholder="i18n('msg2','请输入意见')" />
        </div>
      </div>
    </template>
    <template v-slot:footer>
      <div class="bpm-footer">
        <div @click="closeWindow" class="bpm-footer-close">{{i18n('close','取消')}}</div>
        <div @click="handTrans" class="bpm-footer-ok">{{i18n('ok','确定')}}</div>
      </div>
    </template>
  </rx-layout>
</template>

<script>
import RxLayout from '@/components/RxLayout';
import RxVueUserDialog from '@/components/RxVueUserDialog';
import BpmtaskApi from '@/api/rxBpm/bpmTask'
export default {
  name: "BpmTaskTransferEdit",
  data(){
    return{
      subject:String,
      taskId:String,
      form:{
        opinion:"",
        toUser:[],
        msgTypes:[]
      }
    }
  },
  components: {
    RxLayout,
    RxVueUserDialog
  },
  onLoad(option) {
    let optionData = JSON.parse(option.data);
    this.subject = optionData.subject;
    this.taskId = optionData.taskId;
    this.init();
  },
  methods:{
      i18n(name,text,key){
          return this.$ti18(name,text,"bpmTaskLang.BpmInstTakeBack",key);
      },
    init(){
      this.form.subject=this.subject;
      this.form.taskId=this.taskId;
    },
    handTrans() {
      let self_ = this;
      uni.showModal({
        title:this.i18n('tips','提示信息'),
        content:this.i18n('confirmTransfer','确认转办任务吗?'),
        success: function (res) {
          if (res.confirm) {
            self_.onOk()
          } else if (res.cancel) {
            console.log('用户点击取消');
          }
        }
      });
    },
    onOk() {
      BpmtaskApi.transTask(this.form).then(res => {
        if (res.success) {
          uni.showToast({
            title: res.message, // 消息内容
            duration: 2000, // 持续时间（单位：毫秒）
            icon: 'none' // 图标类型（可选值：success/loading/none）
          });
            this.clickNavLeft(2)
        }else {
          uni.showToast({
            title: res.message, // 消息内容
            duration: 2000, // 持续时间（单位：毫秒）
            icon: 'none' // 图标类型（可选值：success/loading/none）
          });
        }
      })
    },
    closeWindow() {
        this.clickNavLeft()
    },
  }
}
</script>

<style scoped>
.BpmTaskTransferEdit{
  background: white;
  border-radius: 5px;
  padding: 0.5rem;
}
.BpmTaskTransferEdit-textarea {
  font-size: 0.8rem;
  height: 124px;
  width: calc(100% - 1rem) !important;
  margin-top: 15px;
  border-radius: 8px;
  border: 1px solid rgba(232, 232, 232, 1);
  padding: 10px 10px 10px 10px;
}

.bpm-footer {
    display: flex;
    grid-gap: 10px;
}

.bpm-footer-close {
    flex: 1;
    height: 2rem;
    opacity: 1;
    border-radius: 8px;
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(232, 232, 232, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(0, 0, 0, 0.65);
}

.bpm-footer-ok {
    flex: 1;
    height: 2rem;
    opacity: 1;
    border-radius: 8px;
    background: rgba(66, 133, 244, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    color: white;
}
</style>
